<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script>

        var arr=new Array();
        arr[0]=[new Option("---方向---",-1)];
        arr[1]=[new Option("图形计算",1),new Option("软件开发",2),new Option("数据库管理",3)];
        arr[2]=[new Option("商务英语",1),new Option("专业英语",2)];


        function change(index){
            var s2=document.getElementById("s2");

            s2.options.length=0;

            for (var i = 0; i < arr[index].length; i++) {
                s2.options[i]=arr[index][i];
            }

        }



        function loadData(){
            var y=document.getElementById("y");
            var m=document.getElementById("m");
            var d=document.getElementById("d");

            for (var i = 1; i <= 12; i++) {
                var monthOption=new Option(i+"月",i);
                m.options[m.length]=monthOption;
            }


            var currYear=new Date().getFullYear();


            for (var i = currYear-5; i <= currYear+5; i++) {
                var yearOption=new Option(i+"年",i);
                y.options[y.length]=yearOption;
            }

        }

        function loadDay(){
            var y=document.getElementById("y");
            var m=document.getElementById("m");
            var d=document.getElementById("d");

            var year=y.options[y.selectedIndex].value;
            var month=m.options[m.selectedIndex].value;


            if(year==-1||month==-1){
                d.options.length=1;
                return;
            }


            var day=getDay(year,month);

            console.log(year,month,day);

            if(d.length==1){
                for (let i = 1; i <= 28; i++) {
                    var dayOption=new Option(i+"日",i);
                    d.options[d.length]=dayOption;
                }
            }

            d.options.length=29;

            for (var i = 29; i <= day; i++) {
                var dayOption=new Option(i+"日",i);
                d.options[d.length]=dayOption;
            }


            // d.options.length=1;
            //
            // for (var i = 1; i <= day; i++) {
            //     var dayOption=new Option(i+"日",i);
            //     d.options[d.length]=dayOption;
            // }


        }



        function getDay(year,month){
            // if(month==1||month==3||month==5||month==7||month==8||month==10||month==12){
            //     return 31;
            // }else if(month==2){
            //     if(year%400==0||(year%4==0&&year%100!=null)){
            //         return 29;
            //     }else {
            //         return 28;
            //     }
            // }else{
            //     return 30;
            // }
            var date=new Date(year,month,1-1);
            return date.getDate();
        }
    </script>

</head>
<body onload="loadData();">
    <select id="s1" onchange="change(this.selectedIndex);">
        <option value="-1">---专业---</option>
        <option value="1">计算机</option>
        <option value="2">英语</option>
    </select>

    <select id="s2">
        <option value="-1">---方向---</option>
    </select>


    <hr/>



    <!--
        当前页面打开时年和月存在数据
        月 1-12
        年 当前日期所在年的前后5年

        日 根据选择的年和月通过js生成
    -->

    <select id="y" onchange="loadDay();">
        <option value="-1">---年---</option>
    </select>

    <select id="m" onchange="loadDay();">
        <option value="-1">---月---</option>
    </select>

    <select id="d">
        <option value="-1">---日---</option>
    </select>







</body>
</html>